import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:yt_devops/components/app_bar/app_bar_widget.dart';
import 'package:yt_devops/components/gaps.dart';
import 'package:yt_devops/components/select_phone_widget.dart';
import 'package:yt_devops/components/yt_button.dart';
import 'package:yt_devops/components/yt_text_style.dart';
import 'package:yt_devops/resources/str_res_keys.dart';
import 'package:yt_devops/styles/styles.dart';
import '../access_device/views/infoHeaderView.dart';
import 'access_device_by_scanner_controller.dart';

class AccessDeviceByScannerPage extends GetView<AccessDeviceByScannerController> {
    AccessDeviceByScannerPage({Key? key}) : super(key: key);
    @override
  final controller = Get.put(AccessDeviceByScannerController());
    @override
    Widget build(BuildContext context) {
    return  Scaffold(
        appBar: AppBarWidget.withRightActions(ResKey.addNewDevice.tr),
        body: GetBuilder<AccessDeviceByScannerController>(
            builder: (controller) => Column(
                children: [
                    Expanded(
                        child: ListView(padding: EdgeInsets.zero, children: [
                            Container(
                                height: 10,
                                color: Colour.backgroundColor,
                            ),
                            Container(
                                color: Colour.white,
                                // height: 500,
                                child: Column(
                                    crossAxisAlignment: CrossAxisAlignment.start,
                                    children: [
                                        Container(
                                            // color: Colors.red,
                                            margin: EdgeInsets.only(
                                                left: 16.w, right: 16.w, top: 16.h, bottom: 16.h),
                                            child: Text(
                                                ResKey.siteDeviceAccessComplete.tr,
                                                style: ytTextStyle(
                                                    fontSize: 18, fontWeight: FontWeight.w500),
                                            ),
                                        ),
                                        const Divider(
                                            color: Colour.dividerColor,
                                        ),
                                        _itemsList(),
                                        Container(
                                            height: 10,
                                            color: Colour.backgroundColor,
                                        ),
                                        Container(
                                            color: Colour.dividerColor,
                                            height: 1,
                                            margin: EdgeInsets.only(left: 16.w, right: 16.w),
                                        ),
                                        SelectPhotoWidget(
                                            controller.deviceImageList,
                                            true,
                                            3,
                                            photoWidth: 108,
                                            titleFontSize: 18,
                                            titleString: ResKey.siteDeviceAccessDevicePicture.tr,
                                                (List<String> list) {
                                                controller.deviceImageList = list;
                                                controller.update();
                                            },
                                        )
                                    ],
                                ),
                            )
                        ]),
                    ),
                    Align(
                        alignment: Alignment.bottomCenter,
                        child: Container(
                            color: Colour.white,
                            margin: EdgeInsets.only(top: 10.h),
                            padding: EdgeInsets.symmetric(horizontal: 16.w, vertical: 16.h),
                            child: SafeArea(
                                child: YtButton(
                                    enabled: true,
                                    color: Colour.primaryColor,
                                    text: ResKey.finished.tr,
                                    onPress: () => controller.complete(),
                                ),
                            ),
                        ),
                    ),
                ],
            ),
        ),
    );
    }

    _itemsList() {
        List<Widget> list = [];
        for (int i = 0; i < controller.titleList.length; i++) {
            var widget = _itemWidget(controller.titleList[i],
                controller.detailList.isNotEmpty ? controller.detailList[i] : '');
            list.add(widget);
        }
        return SizedBox(
            height: 51 * 5,
            child: Column(
                children: list,
            ),
        );
    }

    _itemWidget(String title, String detail) {
        return Container(
            height: 50,
            alignment: Alignment.centerLeft,
            child: Row(
                children: [
                    Gaps.hGap16,
                    Text(
                        title,
                        style: ytTextStyle(fontSize: 16, fontWeight: FontWeight.normal),
                    ),
                    Spacer(),
                    Text(
                        detail,
                        style: ytTextStyle(fontSize: 16, fontWeight: FontWeight.normal),
                    ),
                    Gaps.hGap16,
                ],
            ),
        );
    }
}
